<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <link rel="stylesheet" type="text/css" th:href="@{/manager/easyui/themes/default/easyui.css}">
    <link rel="stylesheet" type="text/css" th:href="@{/manager/easyui/themes/icon.css}">
    <script type="text/javascript" th:src="@{/manager/easyui/jquery.min.js}"></script>
    <script type="text/javascript" th:src="@{/manager/easyui/jquery.easyui.min.js}"></script>
    <script type="text/javascript">
        let id="";
        let toolbar=[
            {
            text:"修改",
            iconCls:"icon-edit",
            handler:function(){
                alert("edit");
            }
        },
            {
                text:"新增",
                iconCls:"icon-add"
            }
        ]
       $(function(){
           $('#table').datagrid({
               title:"用户列表",
               iconCls:"icon-save",
               url:'test/findAll',
               columns:[
                   [
                       {field:'id',title:'ID',width:200,align:"center"},
                       {field:'username',title:'用户名',width:200,align:"center"},
                       {field:'password',title:'密码',width:200,align:"center"},
                       {field:'status',title:'状态',width:200,align:"center"
                           ,formatter:function(value,row,index){
                               if(row.status==0){
                                   return "启用";
                               }
                               return "禁用"
                           }
                           },
                       {field:'phone',title:'电话',width:200,align:"center"},
                       {field:'createDate',title:'日期',width:200,align:"center"}
                   ]
               ],
               pagination:true,
               singleSelect:true,
               toolbar:"#tb"
           });

           $('#dd').dialog({
               title: 'My Dialog',
               width: 400,
               height: 200,
               closed: true,
               cache: false,
               href: '',
               modal: true,
               buttons: [{
                   text:'提交',
                   iconCls:'icon-ok',
                   handler:function(){
                       alert('ok');
                   }
               },{
                   text:'关闭',
                   handler:function(){
                       alert('cancel');;
                   }
               }]
           });

       });
        function myadd(){
            /*$("#table").datagrid("load",{
                "id":1
            });*/

            /*$("#name").textbox("setValue","12123123");
            alert( $("#name").textbox("getValue"));*/

            /*let row = $("#table").datagrid("getSelected");
            console.log(row);*/

            $('#dd').dialog("open");
        }
    </script>
</head>

<body>
<table id="table"></table>
<div id="tb">
    <input class="easyui-textbox" name="name" id="name"/>
    <button type="button" onclick="myadd()">提交</button>
</div>
<div id="dd">
    111111111111111
</div>
</body>
</html>